<template>
	<view class="page">
		<u-navbar title="帮助中心" is-fixed
			background="url('https://www.yplm888.com//uploads/20220803/7ed305f9a93ba50b049a7725662b18cc.png') no-repeat">
		</u-navbar>
		<!-- <view class="input">
			<my-input @search="search" :value='searchVaule'></my-input>
		</view> -->
		<scroll-view class="" :scroll-y="true" :style="'height:' + scrollH+'rpx;'" refresher-enabled="true"
			:refresher-triggered="triggered" :refresher-threshold="50" @refresherpulling="onPulling"
			@refresherrefresh="onRefresh" @refresherrestore="onRestore" @refresherabort="onAbort">
			<view class="list">
				<view class="remen-class-list" @click="toDetail(item)" v-for="(item, index) in dataList" :key="item.id">
					<!-- <image :src="item.image" mode="widthFix"></image> -->
					<u-image :src="item.image" :lazy-load="true" mode="widthFix" style="width: 100%;">
						<u-loading slot="loading"></u-loading>
					</u-image>
				</view>
			</view>
		</scroll-view>
	</view>
</template>

<script>
	import videoList from '../components/video-list.vue'
	import myInput from '../components/my-input.vue'
	export default {
		components: {
			videoList,
			myInput
		},
		data() {
			return {
				dataList: [],
				type: "liveBack",
				page: 1,
				scrollH: 0,
				triggered: false
			}
		},
		onLoad() {
			this._freshing = false;
			this.getLiveBack()
		},
		onReady() {
			let that = this;
			uni.getSystemInfo({
				success: function(res) {
					that.scrollH = res.windowHeight * 750 / res.windowWidth;
					// #ifdef MP-WEIXIN
					that.scrollH = res.windowHeight * 750 / res.windowWidth - parseInt(res.safeArea.top) - 200;
					// #endif
				}
			});
		},
		onReachBottom() {
			this.page++
			this.getLiveBack()
		},
		methods: {
			toDetail(item){
				this.$u.route('/packageB/pages/adDetail', {
					content_image: item.content_image,
					title:item.title
				})
			},
			getLiveBack() {
				let data = {
					page: this.page,
					limit: 15,
				}
				this.$u.api.getAdList(data).then(res => {
					this.dataList = [...this.dataList, ...res.data]
				})
			},
			onPulling(e) {
				this.triggered = true;
			},
			async onRefresh() {
				if (this._freshing) return;
				this._freshing = true;
				this.page = 1;
				await setTimeout(() => {
					this.triggered = false;
					this._freshing = false;
					this.dataList = []
					this.getLiveBack();
				}, 1000);
				uni.showToast({
					title: '刷新成功',
					duration: 1000
				})
			},
			onRestore() {
				this.triggered = false; // 需要重置
			},
			onAbort() {
				console.log("onAbort");
			}
		}
	}
</script>

<style lang="scss">
	.list {
		margin: 20rpx;
	}
	
	.remen-class-list {
		border-radius: 25rpx;
		width: 100%;
		min-height: 230rpx;
		
		image {
			border-radius: 25rpx;
			width: 100%;
		}
	}
</style>